<template>
  <div class="page-content" v-loading="loading">
    <el-row :gutter="20">
      <el-col class="el-col2">
        <el-button
          type="success"
          icon="el-icon-refresh"
          @click="ReloadSubscribe"
          >刷新微信用户</el-button
        >
        <el-button
          type="warning"
          icon="el-icon-connection"
          @click="ReloadWxuser"
          >同步客户资料</el-button
        >
        <el-button
          type="primary"
          @click="searchdrawer = true"
          icon="el-icon-search"
          >搜索</el-button
        >
        <el-button
          type="danger"
          icon="el-icon-plus"
          v-if="iszh"
          @click="Addzhuserdig"
          >新增账号</el-button
        >
      </el-col>
    </el-row>
    <el-row style="margin-top: 15px">
      <k-table :data="userList" :showPage="false" ref="usertable">
        <el-table-column
          fixed="left"
          label="操作"
          width="180px"
          key="1"
          v-if="optionsform.ywtype === '微信'"
        >
          <template slot-scope="scope">
            <el-button
              type="text"
              icon="el-icon-edit"
              @click="GetWxuserData(scope.row.id)"
            >
              编辑
            </el-button>
            <el-button
              type="text"
              style="color: #FA6962"
              icon="el-icon-connection"
              @click="unbind(scope.row.id, scope.row.login_id)"
            >
              解绑
            </el-button>
          </template>
        </el-table-column>
        <el-table-column
          fixed="left"
          label="操作"
          width="180px"
          key="13"
          v-else
        >
          <template slot-scope="scope">
            <el-button
              type="text"
              icon="el-icon-edit"
              @click="GetzhuserData(scope.row.login_id)"
            >
              修改
            </el-button>
            <el-button
              type="text"
              style="color: #FA6962"
              icon="el-icon-delete"
              @click="Delzhuser(scope.row.login_id)"
            >
              删除
            </el-button>
          </template>
        </el-table-column>
        <el-table-column label="角色" prop="status" key="2">
          <template slot-scope="scope">
            <el-select
              v-model="scope.row.user_role"
              prop="user_role"
              placeholder="未绑定客户"
              @change="SetRole(scope.row.login_id, $event)"
              :disabled="scope.row.user_role == '' ? true : false"
            >
              <el-option
                v-for="(item, index) in userrolelist"
                :key="index"
                :label="item.role"
                :value="item.role"
              ></el-option>
            </el-select>
          </template>
        </el-table-column>
        <template v-if="optionsform.ywtype === '微信'">
          <el-table-column label="头像" prop="headimgurl" key="3">
            <template slot-scope="scope">
              <img class="avatar" :src="scope.row.headimgurl" />
            </template>
          </el-table-column>
          <el-table-column label="账号信息" key="4">
            <el-table-column prop="nickname" label="账号"> </el-table-column>
            <el-table-column label="地区">
              <el-table-column prop="country" label="国家" key="5">
              </el-table-column>
              <el-table-column prop="province" label="省份" key="6">
              </el-table-column>
              <el-table-column prop="city" label="城市" key="7">
              </el-table-column>
            </el-table-column>
          </el-table-column>
          <el-table-column label="绑定客户" prop="real_name" key="8" />
          <el-table-column label="关注日期" prop="subscribe_time" key="9" />
        </template>
        <template v-else>
          <el-table-column label="账号" prop="user_name" key="10" />
          <el-table-column label="绑定客户" prop="real_name" key="11" />
          <el-table-column label="注册日期" prop="reg_time" key="12" />
        </template>
      </k-table>
      <!-- 分页 -->
      <el-pagination
        background
        :page-size="pageSize"
        :total="total"
        :page-sizes="[10, 20, 30, 40, 50, 60, 70, 80]"
        :current-page.sync="page"
        @current-change="changePage"
        layout="total, prev, pager, next, jumper"
      />
    </el-row>
    <el-drawer
      :visible.sync="searchdrawer"
      direction="ttb"
      size="25%"
      title="搜索"
    >
      <el-col class="el-coler" :xs="24" :sm="12" :lg="6">
        <label>账号类型：</label>
        <el-radio
          v-model="optionsform.usertype"
          label="客户"
          border
          size="medium"
          @change="changeusertype('客户')"
          >客户</el-radio
        >
        <el-radio
          v-model="optionsform.usertype"
          label="内部"
          border
          size="medium"
          @change="changeusertype('内部')"
          >内部</el-radio
        >
      </el-col>
      <el-col class="el-coler" :xs="24" :sm="12" :lg="6">
        <label>用户类型：</label>
        <el-radio
          v-model="optionsform.ywtype"
          label="微信"
          border
          size="medium"
          @change="changeywtype('微信')"
          >微信用户</el-radio
        >
        <el-radio
          v-model="optionsform.ywtype"
          label="账号"
          border
          size="medium"
          @change="changeywtype('账号')"
          >账号用户</el-radio
        >
      </el-col>
      <el-col class="el-coler" :xs="24" :sm="12" :lg="6">
        <label>用户状态：</label>
        <el-checkbox
          v-model="isbind"
          border
          size="medium"
          @change="changeisbind($event)"
          >已绑定</el-checkbox
        >
        <el-checkbox
          v-model="issubscribe"
          border
          size="medium"
          @change="changeissubscribe($event)"
          >已取消关注</el-checkbox
        >
      </el-col>
      <el-col class="el-coler">
        <label>{{ optionsform.ywtype == "微信" ? "昵称" : "账号" }}：</label>
        <el-autocomplete
          v-model="autovaule"
          :fetch-suggestions="querySearchAsync"
          placeholder="请输入搜索内容"
          @select="handleSelect"
          size="medium"
          @keyup.enter.native="getUserData"
        ></el-autocomplete>
        <el-date-picker
          v-model="binddate"
          type="daterange"
          align="center"
          unlink-panels
          range-separator="至"
          :picker-options="pickerOptions"
          value-format="yyyy-MM-dd"
        >
        </el-date-picker>
        <el-button type="primary" @click="getUserData">查 询</el-button>
      </el-col>
    </el-drawer>
    <el-dialog
      :title="wxdialogTitle"
      width="500px"
      :visible.sync="wxEdit"
      :close-on-click-modal="false"
    >
      <el-form ref="bindform" :model="bindform" label-width="100px">
        <el-form-item>
          <el-image :src="bindform.headimgurl" class="favatar"></el-image>
        </el-form-item>
        <el-form-item label="分公司">
          <el-input
            v-model="bindform.gscode"
            disabled
            placeholder="未绑定客户"
          ></el-input>
        </el-form-item>
        <el-form-item label="微信昵称">
          <label class="fname">{{ bindform.nickname }}</label>
        </el-form-item>
        <el-form-item label="客户名称">
          <el-autocomplete
            v-model="bindform.real_name"
            :fetch-suggestions="clientquerySearchAsync"
            placeholder="请输入客户名称"
            @select="wxhandleSelect"
            class="input-with-select"
            style="width:100%"
          >
          </el-autocomplete>
        </el-form-item>

        <el-form-item label="账号权限">
          <el-select
            v-model="bindform.user_role"
            placeholder="未绑定客户"
            prop="user_role"
            :disabled="isbdata"
          >
            <el-option
              v-for="(item, index) in userrolelist"
              :key="index"
              :label="item.role"
              :value="item.role"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-form>

      <span slot="footer" class="dialog-footer">
        <el-button @click="wxEdit = false" icon="el-icon-close"
          >取 消</el-button
        >
        <el-button type="primary" @click="bindclient" icon="el-icon-check"
          >保 存</el-button
        >
      </span>
    </el-dialog>
    <el-dialog
      :title="zhdialogTitle"
      width="500px"
      :visible.sync="zhEdit"
      :close-on-click-modal="false"
    >
      <el-form ref="zbindform" :model="zbindform" label-width="100px">
        <el-form-item label="分公司">
          <el-input
            v-model="zbindform.gscode"
            placeholder="请输入分公司"
            :disabled="agscode"
          ></el-input>
        </el-form-item>
        <el-form-item label="账号">
          <el-input
            v-model="zbindform.user_name"
            placeholder="请输入账号"
            :disabled="auser_name"
          ></el-input>
        </el-form-item>
        <el-form-item label="密码">
          <el-input
            type="password"
            v-model="zbindform.password"
            placeholder="请输入密码"
          ></el-input>
        </el-form-item>
        <el-form-item label="客户名称">
          <el-autocomplete
            v-model="zbindform.real_name"
            :fetch-suggestions="zclientquerySearchAsync"
            placeholder="请输入客户名称"
            @select="zhandleSelect"
            class="input-with-select"
            style="width:100%"
          >
          </el-autocomplete>
        </el-form-item>

        <el-form-item label="账号权限">
          <el-select
            v-model="zbindform.user_role"
            placeholder="未绑定客户"
            prop="user_role"
          >
            <el-option
              v-for="(item, index) in userrolelist"
              :key="index"
              :label="item.role"
              :value="item.role"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="zhEdit = false">取 消</el-button>
        <el-button
          type="primary"
          @click="zbindclient"
          v-if="isAddorEdit == false"
          >{{ btntext }}</el-button
        >
        <el-button type="primary" @click="Addzhuser" v-else>{{
          btntext
        }}</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { getUsersApi } from "@/api/userApi";
import { AutocompleteApi } from "@/api/userApi";
import { ReloadSubscribeApi } from "@/api/userApi";
import { SetRoleApi } from "@/api/userApi";
import { ReloadWxuserApi } from "@/api/userApi";
import { GetWxuserApi } from "@/api/userApi";
import { weChatBindingClientApi } from "@/api/userApi";
import { weChatUnBundingClientApi } from "@/api/userApi";
import { GetQpcGuestcodeApi } from "@/api/userApi";
import { GetzhuserApi } from "@/api/userApi";
import { accountBindingClientApi } from "@/api/userApi";
import { RegisterApi } from "@/api/userApi";
import { RemoveLoginApi } from "@/api/userApi";
import moment from "moment";
export default {
  inject: ["reload"],
  data() {
    return {
      loading: true,
      wxEdit: false,
      zhEdit: false,
      searchdrawer: false,
      isbdata: false,
      iszh: false,
      agscode: true,
      auser_name: true,
      isAddorEdit: false,
      wxdialogTitle: "",
      zhdialogTitle: "",
      btntext: "",
      bindform: {
        gscode: "",
        guestcode: "",
        headimgurl: "",
        id: 0,
        login_id: 0,
        nickname: "",
        openid: "",
        qpc_guestcode: "",
        real_name: "",
        user_role: "",
        user_type: ""
      },
      zbindform: {
        gscode: "",
        guestcode: "",
        user_name: "",
        password: "",
        login_id: 0,
        qpc_guestcode: "",
        real_name: "",
        user_role: "",
        user_type: ""
      },
      isbind: false,
      issubscribe: false,
      binddate: [],
      restaurants: [],
      clientrestaurants: [],
      state: "",
      timeout: null,
      page: 1,
      pageSize: 15,
      total: 0,
      autovaule: "",
      optionsform: {
        usertype: "客户",
        subscribe: "0",
        binded: "0",
        ywtype: "微信",
        sort: "",
        begintime: "1900-01-01",
        endtime: "2021-07-19"
      },
      value: "",
      userList: [],
      userrolelist: [],
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            }
          }
        ]
      }
    };
  },
  mounted() {
    this.UsersData(1, "", "", "");
  },
  methods: {
    UsersData(pageindex, val, stime, etime) {
      let userdata = JSON.stringify(this.$store.state.user.user.info);
      userdata = JSON.parse(userdata);
      let guestcode = userdata.reguserno;
      let gscode = userdata.gscode;
      let username = userdata.userName;
      let userid = userdata.id;
      let logintype = userdata.logintype;
      let posttype = userdata.posttype;
      this.optionsform.begintime = stime;
      this.optionsform.endtime = etime;
      getUsersApi({
        guestcode: guestcode,
        gscode: gscode,
        usertype: this.optionsform.usertype,
        subscribe: this.optionsform.subscribe,
        binded: this.optionsform.binded,
        ywtype: this.optionsform.ywtype,
        sort: this.optionsform.sort,
        pagesize: this.pageSize,
        pageindex: pageindex,
        begintime: this.optionsform.begintime,
        endtime: this.optionsform.endtime,
        keyword: val,
        username: username,
        userid: userid,
        menuename: "AccountManguage",
        menucname: "账号管理",
        logintype: logintype,
        posttype: posttype,
        op_type: "查询"
      }).then(res => {
        this.loading = false;
        this.userList = [];
        res.list.forEach(element => {
          element.subscribe_time = moment(element.subscribe_time).format(
            "YYYY-MM-DD hh:mm:ss"
          );
        });
        this.userList = res.list;
        this.userrolelist = res.roles;
        this.total = res.dataCount;
      });
    },
    GetWxuserData(val) {
      this.wxEdit = true;
      this.wxdialogTitle = "修改绑定";
      let userdata = JSON.stringify(this.$store.state.user.user.info);
      userdata = JSON.parse(userdata);
      let guestcode = userdata.reguserno;
      let gscode = userdata.gscode;
      GetWxuserApi({
        guestcode: guestcode,
        gscode: gscode,
        id: val
      }).then(res => {
        if (res.code == "0") {
          this.bindform = res.data[0];
          res.data[0].gscode == ""
            ? (this.isbdata = true)
            : (this.isbdata = false);
        }
      });
    },
    GetzhuserData(val) {
      this.zhEdit = true;
      this.isAddorEdit = false;
      this.btntext = "保 存";
      this.zhdialogTitle = "修改账号";
      let userdata = JSON.stringify(this.$store.state.user.user.info);
      userdata = JSON.parse(userdata);
      let guestcode = userdata.reguserno;
      let gscode = userdata.gscode;
      GetzhuserApi({
        guestcode: guestcode,
        gscode: gscode,
        id: val
      }).then(res => {
        if (res.code == "0") {
          this.zbindform = res.data[0];
        }
      });
    },
    getUserData() {
      this.loading = true;
      this.searchdrawer = false;
      this.UsersData(
        this.pageindex,
        this.autovaule,
        this.binddate[0],
        this.binddate[1]
      );
    },
    bindclient() {
      let userdata = JSON.stringify(this.$store.state.user.user.info);
      userdata = JSON.parse(userdata);
      let guestcode = userdata.reguserno;
      let gscode = userdata.gscode;
      let company = userdata.company;
      weChatBindingClientApi({
        guestcode: guestcode,
        gscode: gscode,
        id: this.bindform.id,
        qpc_guestcode: this.bindform.qpc_guestcode,
        userrole:
          this.bindform.user_role == "" ? "老板" : this.bindform.user_role,
        usertype:
          this.bindform.user_type == "" ? "客户" : this.bindform.user_type,
        openid: this.bindform.openid,
        guestname: this.bindform.real_name,
        company: company
      }).then(res => {
        if (res.code == "0") {
          this.$message.success(res.msg);
          this.wxEdit = false;
          this.loading = true;
          this.UsersData(
            this.pageindex,
            this.autovaule,
            this.binddate[0],
            this.binddate[1]
          );
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    zbindclient() {
      let userdata = JSON.stringify(this.$store.state.user.user.info);
      userdata = JSON.parse(userdata);
      let guestcode = userdata.reguserno;
      let gscode = userdata.gscode;
      accountBindingClientApi({
        guestcode: guestcode,
        gscode: gscode,
        id: this.zbindform.login_id,
        qpc_guestcode: this.zbindform.qpc_guestcode,
        userrole:
          this.zbindform.user_role == "" ? "老板" : this.zbindform.user_role,
        usertype:
          this.zbindform.user_type == "" ? "客户" : this.zbindform.user_type,
        guestname: this.zbindform.real_name,
        password: this.zbindform.password
      }).then(res => {
        if (res.code == "0") {
          this.$message.success("客户绑定成功");
          this.zhEdit = false;
          this.loading = true;
          this.UsersData(
            this.pageindex,
            this.autovaule,
            this.binddate[0],
            this.binddate[1]
          );
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    unbind(val, lval) {
      this.$confirm(
        "您确定解除此账号的绑定吗？（注意：解除绑定后，此账号的相关权限也一并失效。）",
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "error"
        }
      )
        .then(() => {
          let userdata = JSON.stringify(this.$store.state.user.user.info);
          userdata = JSON.parse(userdata);
          let guestcode = userdata.reguserno;
          let gscode = userdata.gscode;
          weChatUnBundingClientApi({
            guestcode: guestcode,
            gscode: gscode,
            id: val,
            kcid: lval
          }).then(res => {
            if (res.code == "0") {
              this.$message.success("解绑成功");
              this.loading = true;
              this.UsersData(
                this.pageindex,
                this.autovaule,
                this.binddate[0],
                this.binddate[1]
              );
            }
          });
        })
        .catch(() => {});
    },
    ReloadSubscribe() {
      this.loading = true;
      let userdata = JSON.stringify(this.$store.state.user.user.info);
      userdata = JSON.parse(userdata);
      let guestcode = userdata.reguserno;
      let gscode = userdata.gscode;
      ReloadSubscribeApi({
        guestcode: guestcode,
        gscode: gscode
      }).then(res => {
        this.loading = false;
        if (res.code == "0") {
          this.$message.success(res.msg);
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    ReloadWxuser() {
      let userdata = JSON.stringify(this.$store.state.user.user.info);
      userdata = JSON.parse(userdata);
      let guestcode = userdata.reguserno;
      let gscode = userdata.gscode;
      ReloadWxuserApi({
        guestcode: guestcode,
        gscode: gscode
      }).then(res => {
        if (res.code == "0") {
          this.$message.success(res.msg);
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    SetRole(val, role) {
      let userdata = JSON.stringify(this.$store.state.user.user.info);
      userdata = JSON.parse(userdata);
      let guestcode = userdata.reguserno;
      let gscode = userdata.gscode;
      SetRoleApi({
        guestcode: guestcode,
        gscode: gscode,
        id: val,
        userrole: role
      }).then(res => {
        if (res.code == "0") {
          this.$message.success(res.msg);
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    deleteUser(scope) {
      this.$confirm("您确定要注销当前用户吗", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "error"
      })
        .then(() => {
          this.userList.splice(scope.$index, 1);
        })
        .catch(() => {});
    },
    changePage(val) {
      this.UsersData(val, this.autovaule);
    },
    querySearchAsync(queryString, cb) {
      let userdata = JSON.stringify(this.$store.state.user.user.info);
      userdata = JSON.parse(userdata);
      let guestcode = userdata.reguserno;
      let gscode = userdata.gscode;
      let username = userdata.userName;
      let fieldname =
        this.optionsform.ywtype == "微信" ? "nickname" : "user_name";
      let keyword =
        this.optionsform.ywtype == "微信" ? "nickname" : "user_name";
      let ywtype =
        this.optionsform.ywtype == "微信" ? "wx_user_info" : "wx_user_login";
      AutocompleteApi({
        guestcode: guestcode,
        gscode: gscode,
        fieldname: fieldname,
        keyword: keyword,
        ywtype: ywtype,
        query: this.autovaule,
        username: username
      }).then(res => {
        this.loading = false;
        this.restaurants = [];
        res.suggestions.forEach(element => {
          this.restaurants.push({ value: element.value });
        });
        var restaurants = this.restaurants;
        var results = queryString
          ? restaurants.filter(this.createStateFilter(queryString))
          : restaurants;

        clearTimeout(this.timeout);
        this.timeout = setTimeout(() => {
          cb(results);
        }, 100 * Math.random());
      });
    },
    clientquerySearchAsync(queryString, cb) {
      let userdata = JSON.stringify(this.$store.state.user.user.info);
      userdata = JSON.parse(userdata);
      let guestcode = userdata.reguserno;
      let gscode = userdata.gscode;
      let username = userdata.userName;
      let fieldname = "codename";
      let keyword = "codename";
      let ywtype = "bus_client";
      AutocompleteApi({
        guestcode: guestcode,
        gscode: gscode,
        fieldname: fieldname,
        keyword: keyword,
        ywtype: ywtype,
        query: this.bindform.real_name,
        username: username
      }).then(res => {
        this.clientrestaurants = [];
        res.suggestions.forEach(element => {
          this.clientrestaurants.push({ value: element.value });
        });
        var clientrestaurants = this.clientrestaurants;
        var results = queryString
          ? clientrestaurants.filter(this.createStateFilter(queryString))
          : clientrestaurants;
        clearTimeout(this.timeout);
        this.timeout = setTimeout(() => {
          cb(results);
        }, 100 * Math.random());
      });
    },
    zclientquerySearchAsync(queryString, cb) {
      let userdata = JSON.stringify(this.$store.state.user.user.info);
      userdata = JSON.parse(userdata);
      let guestcode = userdata.reguserno;
      let gscode = userdata.gscode;
      let username = userdata.userName;
      let fieldname = "codename";
      let keyword = "codename";
      let ywtype = "bus_client";
      AutocompleteApi({
        guestcode: guestcode,
        gscode: gscode,
        fieldname: fieldname,
        keyword: keyword,
        ywtype: ywtype,
        query: this.zbindform.real_name,
        username: username
      }).then(res => {
        this.clientrestaurants = [];
        res.suggestions.forEach(element => {
          this.clientrestaurants.push({ value: element.value });
        });
        var clientrestaurants = this.clientrestaurants;
        var results = queryString
          ? clientrestaurants.filter(this.createStateFilter(queryString))
          : clientrestaurants;
        clearTimeout(this.timeout);
        this.timeout = setTimeout(() => {
          cb(results);
        }, 100 * Math.random());
      });
    },
    createStateFilter(queryString) {
      return state => {
        return (
          state.value.toLowerCase().indexOf(queryString.toLowerCase()) !== -1
        );
      };
    },
    handleSelect(item) {},
    wxhandleSelect(item) {
      if (item.value != "") {
        this.isbdata = false;
        let userdata = JSON.stringify(this.$store.state.user.user.info);
        userdata = JSON.parse(userdata);
        let guestcode = userdata.reguserno;
        let gscode = userdata.gscode;
        GetQpcGuestcodeApi({
          guestcode: guestcode,
          gscode: gscode,
          guestname: item.value
        }).then(res => {
          this.bindform.gscode = res.data[0].gscode;
          this.bindform.qpc_guestcode = res.data[0].guestcode;
        });
        this.bindform.user_role = "老板";
      }
    },
    zhandleSelect(item) {
      if (item.value != "") {
        let userdata = JSON.stringify(this.$store.state.user.user.info);
        userdata = JSON.parse(userdata);
        let guestcode = userdata.reguserno;
        let gscode = userdata.gscode;
        GetQpcGuestcodeApi({
          guestcode: guestcode,
          gscode: gscode,
          guestname: item.value
        }).then(res => {
          this.zbindform.gscode = res.data[0].gscode;
          this.zbindform.qpc_guestcode = res.data[0].guestcode;
        });
      }
    },
    changeusertype(val) {
      this.optionsform.usertype = val;
      this.UsersData(
        this.pageindex,
        this.autovaule,
        this.binddate[0],
        this.binddate[1]
      );
      this.searchdrawer = false;
      this.loading = true;
    },
    changeywtype(val) {
      this.optionsform.ywtype = val;
      if (val == "账号") {
        this.iszh = true;
      } else {
        this.iszh = false;
      }
      this.UsersData(
        this.pageindex,
        this.autovaule,
        this.binddate[0],
        this.binddate[1]
      );
      this.searchdrawer = false;
      this.loading = true;
    },
    changeisbind(val) {
      if (val) {
        this.optionsform.binded = "1";
      } else {
        this.optionsform.binded = "0";
      }
      this.UsersData(
        this.pageindex,
        this.autovaule,
        this.binddate[0],
        this.binddate[1]
      );
      this.searchdrawer = false;
      this.loading = true;
    },
    changeissubscribe(val) {
      if (val) {
        this.optionsform.subscribe = "1";
      } else {
        this.optionsform.subscribe = "0";
      }
      this.UsersData(
        this.pageindex,
        this.autovaule,
        this.binddate[0],
        this.binddate[1]
      );
      this.searchdrawer = false;
      this.loading = true;
    },
    Addzhuserdig() {
      this.zhEdit = true;
      this.agscode = false;
      this.auser_name = false;
      this.zhdialogTitle = "创建账号";
      this.btntext = "添 加";
      this.isAddorEdit = true;
      this.zbindform.gscode = "A001";
      this.zbindform.guestcode = "";
      this.zbindform.user_name = "";
      this.zbindform.password = "";
      this.zbindform.login_id = 0;
      this.zbindform.qpc_guestcode = "";
      this.zbindform.real_name = "";
      this.zbindform.user_role = "老板";
      this.zbindform.user_type = "客户";
    },
    Addzhuser() {
      let userdata = JSON.stringify(this.$store.state.user.user.info);
      userdata = JSON.parse(userdata);
      let guestcode = userdata.reguserno;
      let gscode = userdata.gscode;
      RegisterApi({
        guestcode: guestcode,
        gscode: gscode,
        username: this.zbindform.user_name,
        userrole: this.zbindform.user_role,
        usertype: this.zbindform.user_type,
        password: this.zbindform.password,
        qpc_guestcode: this.zbindform.qpc_guestcode,
        guestname: this.zbindform.real_name
      }).then(res => {
        if (res.code == "0") {
          this.$message.success("创建账号成功");
          this.zhEdit = false;
          this.loading = true;
          this.UsersData(
            this.pageindex,
            this.autovaule,
            this.binddate[0],
            this.binddate[1]
          );
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    Delzhuser(val) {
      let userdata = JSON.stringify(this.$store.state.user.user.info);
      userdata = JSON.parse(userdata);
      let guestcode = userdata.reguserno;
      let gscode = userdata.gscode;
      RemoveLoginApi({
        guestcode: guestcode,
        gscode: gscode,
        id: val
      }).then(res => {
        if (res.code == "0") {
          this.$message.success("删除账号成功");
          this.zhEdit = false;
          this.loading = true;
          this.UsersData(
            this.pageindex,
            this.autovaule,
            this.binddate[0],
            this.binddate[1]
          );
        } else {
          this.$message.error(res.msg);
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.page-content {
  width: 100%;
  height: 100%;
  .el-col2 {
    margin-bottom: 10px;
  }
  .el-coler {
    margin-left: 20px;
    margin-top: 20px;
  }
  ::v-deep .el-radio {
    margin-right: 10px;
  }
  ::v-deep .el-checkbox {
    margin-right: 10px;
  }
  .avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
  }
  .favatar {
    width: 80px;
    height: 80px;
    border-radius: 10%;
  }
  .fname {
    color: #2d8cf0;
  }
}
</style>
